<template>
	<view class="content bgc-f0">
		<view class="p26 bgc-fff search_sticky">
			<u-search 
				placeholder="请输入客户姓名,手机号等关键字" 
				v-model="value" 
				shape="round" 
				@blur="getStreamData" 
				@search="getStreamData" 
				@custom="getStreamData"
			>
			</u-search>
		</view>
		
		<template v-if="list.length > 0">
			<template v-for="(it,index) in list">
				<view class="_li" @click="handShare(it)" :key="index">
					<u-image src="@/static/images/member.png" width="100" height="100"></u-image>
					<view class="flex-1 fs26 z-flex ml20" style="flex-direction: column;position: relative;">
						<view class="z-flex z-flex-align-c">
							<text class="fs30">{{it.memberName}}</text>
							<text v-if="it.memberPhone">（{{it.memberPhone}}）</text>
<!-- 							<text class="fs26 c-e138aa ml20">12</text>
							<text class="fs27 c-e138aa ml4">粉丝</text> -->
						</view>
						<view class="z-flex z-flex-align-c mt10 mb10">
							<text class="mr40">{{it.careatAt}}</text>
							<text class="c-theme">加入</text>
						</view>
<!-- 						<view class="mt10" style="text-align: right;">
							<text class="fs24" style="color: #00ACC1;">他分享了2人</text>
							<u-icon name="arrow-right" color="#00ACC1" size="20" style="position: relative;top:-4rpx;"></u-icon>
						</view>
						<view class="_line mt10"></view>
						<view class="z-flex z-flex-between pt20">
							<text>累计消费：￥2500</text>
							<text>累计收益：￥2500</text>
						</view> -->
						<view class="_total"><text class="fs26 c-fff">会员</text></view>
					</view>
				</view>
			</template>
		</template>
		
		<vempty v-show="dataLe" title="暂无数据"></vempty>
	</view>
</template>

<script>
	import { getBusinessMemberApi } from '@/api/user.js'
	export default{
		data(){
			return {
				value: '',
				dataLe: false,
				list: []
			}
		},
		onShow() {
			this.$nextTick(this.getStreamData)
		},
		methods:{
			async getStreamData(){
				uni.showLoading({
					title: '数据加载中...',
					icon: 'none'
				})
				const {code,data} = await getBusinessMemberApi({
					inviteId: uni.getStorageSync('userId')
				})
				uni.hideLoading()
				if(code !=0) return
				this.list = data.list
				this.dataLe = data.count == 0
			},
			handShare(e){
				// return false
				const { memberId } = e
				uni.$u.route({
					type: 'navigateTo',
					url: 'mapPages/backAdmin/store_info/sharing',
					params: {
						id: memberId
					}
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.content{
		.c-e138aa{
			color: #e138aa;
		}
		._li{
			display: flex;
			padding: 26rpx;
			border-bottom: 1rpx solid #F8F8F8;
			background-color: #FFFFFF;
			._total{
				width: 110rpx;
				height: 46rpx;
				line-height: 46rpx;
				text-align: center;
				background-color: #e138aa;
				border-radius: 40rpx;
				position: absolute;
				right: 0;
				top: 50%;
				transform: translateY(-50%);
			}
			._line{
				border-bottom: 1rpx solid #F8F8F8;
			}
		}
	}
</style>
